<template>
  <div>
    <div class="foot">
      <span>{{ date }} {{ time }}</span>
    </div>
  </div>
</template>
<script>
import { getBeijingtime } from "../utils/Methods";
export default {
  name: "FooterTabbar",
  components: {},
  data() {
    return {
      time: "",
      date: "",
      day: "",
    };
  },
  created() {
    // 获取时间
    this.updateTime();
  },
  methods: {
    updateTime() {
      let _this = this;
      this.timeInterval = setInterval(() => {
        const data = getBeijingtime();
        // console.log(getBeijingtime("2020/07/15"));
        const Y = data.getFullYear() + "年";
        const M =
          (data.getMonth() + 1 < 10
            ? "0" + (data.getMonth() + 1)
            : data.getMonth() + 1) + "月";

        const D = data.getDate() + "日";
        _this.date = Y + M + D;
        _this.time =
          data.getHours().toString().padStart(2, 0) +
          ":" +
          data.getMinutes().toString().padStart(2, 0) +
          ":" +
          data.getSeconds().toString().padStart(2, 0); // 修改数据date
        // console.log(_this.time);
      }, 1000);
    },
    beforeDestroy() {
      if (this.timeInterval) {
        clearInterval(this.timeInterval); // 在Vue实例销毁前，清除我们的定时器
      }
    },
    // 获取亮度 设置亮度
  },
};
</script>
<style lang="scss" scoped>
.foot {
  width: 100%;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ccc;
  font-size: 16px;
}
</style>
